<template>
	<view>
		<uni-popup ref="popupLogin" :mask-click="true" type="bottom">
			<view class="login">
				<view class="title">选择登录方式</view>
				<button class="common-btn btn" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
					<!-- <image class="wxicon" :src="(imgUrl+'/wx/weixin.png')"></image> -->
					<view>手机号快捷登录</view>
				</button>
				<view class="common-btn btn" @click="goLogin()">账户密码登录</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import uniPopup from '../uni-popup/uni-popup.vue'
	export default {
		components: {
			uniPopup
		},
		props:{
			value: String,
			mode: String
		},
		data() {
			return {
				imgUrl:this.$config.BASE_imgUrl,
				wxLoginRes: {}
			}
		},
		methods: {
			show(){
				console.warn("refs: ", this.$refs)
				this.$refs.popupLogin.open()

				uni.login({
					provider: 'weixin',
					success: (loginRes) => {
						console.warn("授信信息：", loginRes);

						this.wxLoginRes = loginRes
					}
				});
			},
			hide(){
				this.$refs.popupLogin.close()
			},
			getPhoneNumber(e) {
				this.$refs.popupLogin.close()

				console.warn("getPhoneNumber: ", e.detail)
				if (e.detail.encryptedData) {
					this.$util.post({
						url: "wx/login/wxAppletLogin",
						data: {
							jsCode: this.wxLoginRes.code,
							encryptedData: e.detail.encryptedData,
							iv: e.detail.iv
						}
					}).then((res)=>{
						console.warn("微信授权登录结果：", res)
						this.$util.loginSuccess(res)
						this.$store.commit('changeTabbarName','首页')
					})
					// uni.login({
					// 	provider: 'weixin',
					// 	success: (loginRes) => {
					// 		console.warn("授信信息：", loginRes);

					// 		this.$util.post({
					// 			url: "login/wxAppletLogin",
					// 			data: {
					// 				jsCode: loginRes.code,
					// 				encryptedData: e.detail.encryptedData,
					// 				iv: e.detail.iv
					// 			}
					// 		}).then((res)=>{
					// 			console.warn("微信授权登录结果：", res)
					// 			this.$util.loginSuccess(res)
					// 		})
					// 	}
					// });
				}
			},
			goLogin() {
				this.$refs.popupLogin.close()
				uni.navigateTo({
					url: "/pagesC/login/login"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.login {
	display: flex;
	flex-direction: column;
	background-color: #FFFFFF;
	width: 750rpx;
	height: 400rpx;
	text-align: center;
	font-size: 32rpx;
	color: #333333;
	padding: 20rpx 0rpx;
	.title {
		margin-bottom: 30rpx;
		font-weight: bold;
	}
	.wxicon {
		width: 60rpx;
		height: 60rpx;
		margin-right: 10rpx;
	}
	.button {
		width: 100%;
		height: 100%;
		background-color: transparent;
		color: #FFFFFF;
	}
	.btn {
		font-size: 28rpx;
		margin-top: 20rpx;
		margin-bottom: 0rpx;
		font-weight: normal;
	}
}
</style>
